<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>

<link rel="stylesheet" type="text/css" href="js/bootstarp-3.3.7/css/bootstrap.min.css" />
	<script src="js/jquery-3.2.0.min.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/bootstarp-3.3.7/js/bootstrap.min.js" type="text/javascript" charset="utf-8"></script>
	<link rel="stylesheet" type="text/css" href="js/bootstarp-table-1.11.1/bootstrap-table.min.css" />
	<script src="js/bootstarp-table-1.11.1/bootstrap-table.min.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/bootstarp-table-1.11.1/bootstrap-table-zh-CN.min.js" type="text/javascript" charset="utf-8"></script>
		
		
		
    <script type="text/javascript">
    $(function() {
    	$("#tab").bootstrapTable({
    		url:"ccgl/ou.lgg",
			pagination:true,
			pageSize:5, 
			queryParams:queryParam,
			columns:[{
				field:'pickout_id',
				title:'出库执行单号',
			    align:'center'
			},{
				field:'name',
				title:'仓库',
			    align:'center'
			},{
				field:'update_date',
				title:'拣货完成时间',
				align:'center'
			},{
				field:'done_flag',
				title:'状态',
				align:'center'
			},{
				title:'拣货完成确认',
				field:'pickout_id',
			    align:'center',
			    formatter:function (value,row,index) {
					return"<button class='btn btn-info glyphicon glyphicon-edit'  onclick='sel("+row.pickout_id+")'></button>"
			    }
			}]
    	})
    	
    	
    	
    	/* 
    	 $("#tab3").bootstrapTable({
				url:"ccgl/yck.lgg",
				pagination:true,
				pageSize:10, 
				queryParams:{},				
				columns:[{
					field:'prod_id',
					title:'货物编号',
				    align:'center'
				},{
					field:'pname',
					title:'货物名称',
				    align:'center'
				},{
					field:'package_name',
					title:'包装单位',
					align:'center'
				},{
					field:'preout_amt',
					title:'预出库数量',
					align:'center'
				},{
					field:'done_flag',
					title:'出库确认',
					align:'center'
				}]
			})
	   */
    	
    })
    
    	function queryParam(){
			return{
		/* 	'wh_id':$("#name").val(), */
			}
			
		}
    	
    	function sel(pickout_id){    	
    		 $.ajax({
 	    		type:"post",
 	    		url:"ccgl/upzt.lgg",
 	    		data:"pickout_id="+pickout_id,
 	    		success:function (data) { 
 	    		
 	    		}
 	    	});
 		
    	$("#mModal").modal('show');
    	 	$("#tab2").bootstrapTable("destroy");
    		$("#tab2").bootstrapTable({
    			url:"ccgl/mxb.lgg",
    			pagination:true,
    			queryParams:"pickout_id="+pickout_id,
    			pageSize:5, 
    			columns:[{
					field:'pickout_id',
					title:'拣货单号',
					align:'center'
				},{
					field:'pname',
					title:'货物名称',
					align:'center'
				},{
					field:'pname',
					title:'货物类型',
					align:'center'
				},{
					field:'packname',
					title:'包装单位',
					align:'center'
				},{
					field:'out_amt',
					title:'已预出库数量',
					align:'center'	
				}
				    
				]
				
    		})
    		
    	  $("#tab3").bootstrapTable("destroy");
       	  $("#tab3").bootstrapTable({
   				url:"ccgl/yck.lgg",
   				pagination:true,
   				pageSize:10, 
   				queryParams:"pickout_id="+pickout_id,							
   				columns:[{
   					field:'prod_id',
   					title:'货物编号',
   				    align:'center'
   				},{
   					field:'pname',
   					title:'货物名称',
   				    align:'center'
   				},{
   					field:'package_name',
   					title:'包装单位',
   					align:'center'
   				},{
   					field:'preout_amt',
   					title:'预出库数量',
   					align:'center'
   				},{
   					field:'done_flag',
   					title:'出库确认',
   					align:'center'
   				}]
   			}) 
    		
    	}
    
       
    
    
    
    </script>

</head>
<body>
	
	
	  <div class="modal fade bs-example-modal-lg" id="mModal" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel">
     <div class="modal-dialog modal-lg" role="document" style="width:1200px">
     <div class="modal-content">
     	<div class="modal-header">
			<h4>出库确认</h4>			
		</div>
     	
     	
            <div class="modal-body">
					<table id="tab2"></table>	
	                  
	                  <h4>货物清单</h4>
                    <table id="tab3"></table>
			</div>
			
			<div class="modal-footer ">
						<button type="button" class="btn btn-danger glyphicon glyphicon-remove" data-dismiss="modal"></button>
						<button type="button" class="btn btn-success glyphicon glyphicon-ok" ></button>
					</div>
    </div>
  </div>
</div>
	
<table id="tab"></table>

</body>
</html>